.social, #about
  text-shadow 2px 2px 4px var(--theme-text-rev)

.navBlock > .navItemTitle
  text-shadow 1px 1px 2px var(--theme-text-rev), 1px 1px 2px var(--theme-text-rev)

[theme-mode=light]
  .navItemTitle
    font-weight bold
  
  @media (min-width 769px)
    aside img:hover
      background-color var(--theme-bg-soft)

  button
    text-shadow 0 0 10px #000

  #color-mode
    @media (min-width 769px)
      &:hover::after
        transform rotate(-90deg)
    &::after
      transform rotate(-180deg)
      animation clockwise .3s
  @keyframes clockwise
    0%
      transform rotate(-270deg)
    100%
      transform rotate(-180deg)

@media (min-width 769px)
  [theme-mode=dark]
    #color-mode:hover::after
      filter invert(1)

#post-bg,
h1, h2, h3, h4, h5, h6
  transition 1s

@property --theme-bg-trans1
  syntax '<color>'
  inherits true
  initial-value #fff

#aside-block
  transition --theme-bg-trans1 1s
